<?php
$templateURL = $this->basePath('/templates/admin/');
?>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="shortcut icon" href="../../favicon.jpg">

    <title>Admin's page</title>
    <link href="<?php echo $templateURL.'css/bootstrap.css'?>" rel="stylesheet">
    <link href="<?php echo $templateURL.'css/jumbotron-narrow.css'?>" rel="stylesheet">
    <link href="<?php echo $templateURL.'css/mythemes.css'?>" rel="stylesheet">
    <script src="<?php echo $templateURL.'../../js/jquery-1.11.0.js'?>"></script>
    <script src="<?php echo $templateURL.'../../js/bootstrap.js'?>"></script>
    <script src="<?php echo $templateURL.'../../js/highchart/highcharts.js'?>"></script>
    <script src="<?php echo $templateURL.'../../js/highchart/modules/exporting.js'?>"></script>

  </head>

  <body>
    <div class="container">
      <div class="header">
        <h3 class="text-muted">Admin's page</h3>
      </div>
        <!-- <div class="sidebar pull-left" style="height:100%; width:200px; border: 1px solid black;">
        </div> -->
        <div class="content" style="padding:0px; margin:0px;">
          <table style="width:100%;">
          <tr>
            <td class="sidebar" style="width:200px;">
              <div class="list-group">
                <?php if($username){?><a href="#" class="list-group-item list-group-item-success">Xin chào <?php echo($username); ?></a><?php }?>
                <a href="/admin" class="list-group-item" id="index">Trang chủ</a>
                <a href="/admin/manage" class="list-group-item" id="manage">Quản lý sản phẩm</a>
                <a href="/admin/bill" class="list-group-item" id="bill">Quản lý hóa đơn</a>
                <a href="/admin/statistic" class="list-group-item" id="statistic">Thống kê doanh số</a>
                <a href="/admin/request" class="list-group-item" id="request">Các đơn đặt hàng</a>
                <?php if($username){?><a href="/admin/auth/logout" class="list-group-item"><button class="btn btn-danger pull-right">Thoát</button></a><?php }?>
              </div>
            </td>
            <td class="main-content" style="vertical-align:top;">
              <?php 
                echo $this->content; 
              ?>
            </td>
          </tr>
        </table>
        </div>
      <br/>
      <div class="footer">
        <p>admin's page</p>
      </div>

    </div> <!-- /container -->
  </body>
</html>
<style type="text/css" media="screen">
  body{
    height: 100%;
  }  

  .footer{
    bottom: 0px;
  }

  .usernamelogout{
    
  }
</style>
<script>
  window.onload = function(){
    if('null' != controllername){
      switch(controllername){
        case 'manage':
          $('#manage').attr('class', 'list-group-item active');
        break;
        case 'index':
          $('#index').attr('class', 'list-group-item active');
        break;
        case 'statistic':
          $('#statistic').attr('class', 'list-group-item active');
        break;
        case 'request':
          $('#request').attr('class','list-group-item active');
        break;
        case 'bill':
          $('#bill').attr('class','list-group-item active');
        break;
        default:
        $('#index').attr('class', 'list-group-item active');
        break;
      }
    }else{
      console.log("ko ton tai bien controllername");
    }
  }
    var imgArr;
    function resizeImage(){
      imgArr = $('img[id="thumbnail-images"]');    
      imgArr.width(100);
      imgArr.height('auto');
    }
    resizeImage();
    function imgError(image){
      image.onerror = "";
      image.src = "/files/not-found.png";
      return true;
    }

    function autoResize(){
      header = $('.header');
      footer = $('.footer');
      if(window.innerHeight > 480){
        height = window.innerHeight - header.height() - footer.height() - 110 + "px";
        $('.content > table').css('height',height);
      }else{
        return;
      }
    }
    window.onresize = autoResize;
    autoResize();
</script>